<%--
  Created by IntelliJ IDEA.
  User: 李文彬
  Date: 2023/6/25
  Time: 11:08
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <!-- 导入资源 -->
    <%@ include file="resource.jsp" %>
    <script>
        $(document).ready(function () {

            $("#username").focus();

            $("#submitBtn").click(function () {
                let pass = true;
                let username = $("#username");
                let oldpassword = $("#Old password");
                let newpassword = $("#New password");
                if (username.val() != null && username.val().trim().length >= 4 && username.val().trim().length <= 20) {
                    username.attr("class", "form-control is-valid");
                } else {
                    pass = false;
                    username.attr("class", "form-control is-invalid");
                }
                if (Oldpassword.val() != null && Oldpassword.val().trim().length >= 4 && Oldpassword.val().trim().length <= 20) {
                    Oldpassword.attr("class", "form-control is-valid");
                } else {
                    pass = false;
                    Oldpassword.attr("class", "form-control is-invalid");
                }
                if (newpassword.val() != null && newpassword.val().trim().length >= 4 && newpassword.val().trim().length <= 20) {
                    newpassword.attr("class", "form-control is-valid");
                } else {
                    pass = false;
                    newpassword.attr("class", "form-control is-invalid");
                }
                return pass;
            });
        });

    </script>
</head>
<body>
<%@ include file="header.jsp" %>
<div style="margin-left: 60px;">
    <a href="index.jsp">Home</a> >> <a href="changepw.jsp">changepw</a>
</div>
<form action="user-changepw.do" method="post" style="width: 640px; margin: 0 auto;">
    <div class="row my-4 g-3 align-items-center">
        <div class="col-auto">
            <label for="username" class="col-form-label">Username</label>
        </div>
        <div class="col-auto">
            <input type="text" id="username" name="username"
                   class="form-control">
        </div>
        <div class="col-auto">
            <span class="form-text"> Must be 4-20 characters long. </span>
        </div>
    </div>
    <div class="row my-4 g-3 align-items-center">
        <div class="col-auto">
            <label for="Old password" class="col-form-label">Old Password</label>
        </div>
        <div class="col-auto">
            <input type="password" id="Old password" name="old password"
                   class="form-control">
        </div>
        <div class="col-auto">
			<span id="Old passwordHelpInline" class="form-text"> Must be
				4-20 characters long. </span>
        </div>
    </div>
    <div class="row my-4 g-3 align-items-center">
        <div class="col-auto">
            <label for="New password" class="col-form-label">New Password</label>
        </div>
        <div class="col-auto">
            <input type="password" id="New password" name="new password"
                   class="form-control">
        </div>
        <div class="col-auto">
			<span id="New passwordHelpInline" class="form-text"> Must be
				4-20 characters long. </span>
        </div>
    </div>
    <button id="submitBtn" class="btn btn-primary">Submit</button>
</form>
<!-- 导入页脚 -->
<%@ include file="footer.jsp" %>
</body>
</html>
